<template>
  <div class="location">
    <!-- 标题 -->
    <h1 style="height: 30%;">欢迎来到人力资源管理系统</h1>
    <!-- 阴影卡片 -->
    <el-card style="display: flex;justify-content: space-between;">
      <h3>请点击按钮选择你的登录方式</h3>
      <!-- 按钮 -->
      <el-button type="primary" plain @click="admin">以管理员的身份登录</el-button>
      <el-button type="primary" plain @click="user">以用户的身份登录</el-button>
    </el-card>
  </div>
</template>

<script setup>
//引入路由器
import { useRouter } from 'vue-router';
const router = useRouter();
//点击管理员按钮后跳转的方法 跳转到管理员登录界面
const admin = () => {
  router.push('/adminHome')
}
//点击用户按钮后跳转的方法 跳转到用户登录界面
const user = () => {
  router.push('/userHome')
}
</script>

<style scoped>
.location {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  /* background-image: url('@/assets/background.jpg'); */
  background-color: beige;
}
</style>